//通过函数返回最新的Variable变量表 更新样式
import { Platform,Dimensions } from 'react-native';
import Color from '../../config/theme/standard/color';
const generateMessageBox = (Variables)=>{
    return {
        //弹窗圆角
        messageBoxRadius:Variables.radiusM,
        //标题文本字号
        messageBoxTitleFontSize:Variables.fontSizeXl,
        //标题文本颜色
        messageBoxTitleColor:Variables.colorBlack,
        //标题文本字重
        messageBoxTitleFontWeight:Variables.fontWeightBold,
         //内容文本字号
         detailFontSzie:Variables.fontSizeBase,
        //内容文本颜色
        detailTextColor:Variables.colorGray1,
        //弹窗按钮高度
        footHeight:Variables.sizeHeightXxl,
        //弹窗按钮文字字号
        footButtonFontSize:Variables.fontSizeL,
        //弹窗次要操作按钮文字颜色
        footButtonTextColor:Variables.colorGray2,
        //弹窗主要操作按钮文字颜色
        footRightButtonTextColor:Variables.colorBrand5,
        //弹窗输入内容字号
        inputFontSize:Variables.fontSizeBase,
        //弹窗输入内容颜色
        inputTextColor:Variables.colorBlack,
        //弹窗提示语颜色
        inputPlaceholderTextColor:Variables.colorGray3
    }
}

const getMessageBoxStyle =(Variables)=>{
    let  messageBoxStyle = generateMessageBox(Variables)
    let styles = {
        maskStyle: {
            position: Platform.OS == "web" ? "fixed" : 'absolute',
            backgroundColor: 'rgba(0, 0, 0, 0.4)',
            top: 0,
            bottom: 0,
            left: 0,
            right: 0,
            zIndex:0,
            alignItems: 'center',
            justifyContent: 'center',
        },
        modalBox: {
            width: Dimensions.get('window').width * 0.912,
            borderRadius: messageBoxStyle.messageBoxRadius
        },
        container: {
            borderRadius: messageBoxStyle.messageBoxRadius,
        },
        androidLine: {
            height: 1,
            borderWidth: 1,
            borderBottomColor: Color.border,
            borderTopColor: Color.white,
            borderLeftColor: Color.white,
            borderRightColor: Color.white,
            backgroundColor: Color.white,
        },
        titleContainer: {
            height: 48,
            alignItems: 'center',
            justifyContent: 'flex-end',
            backgroundColor: Color.white,
            borderTopLeftRadius: messageBoxStyle.messageBoxRadius,
            borderTopRightRadius: messageBoxStyle.messageBoxRadius,
        },
        titleContainerType5: {
            height: 48,
            alignItems: 'center',
            justifyContent: 'flex-end',
            backgroundColor: Color.white,
            borderTopLeftRadius: messageBoxStyle.messageBoxRadius,
            borderTopRightRadius: messageBoxStyle.messageBoxRadius,
        },
        titleText: {
            color: messageBoxStyle.messageBoxTitleColor,
            fontSize: messageBoxStyle.messageBoxTitleFontSize,
            fontWeight: messageBoxStyle.messageBoxTitleFontWeight,
        },
        detailTextContainer: {
            backgroundColor: Color.white,
            borderBottomWidth: 1,
            borderColor: Color.border,
            justifyContent: 'center',
            alignItems: 'flex-start',
        },
        detailTextContainerType5: {
            backgroundColor: Color.white,
            borderColor: Color.border,
            justifyContent: 'center',
            alignItems: 'flex-start'
        },
        detailText: {
            alignSelf: 'center',
            color: messageBoxStyle.detailTextColor,
            fontSize: messageBoxStyle.detailFontSzie,
            fontWeight: '400',
        },
        footer: {
            flexDirection: 'row',
            backgroundColor: Color.white,
            borderBottomRightRadius: messageBoxStyle.messageBoxRadius,
            borderBottomLeftRadius: messageBoxStyle.messageBoxRadius,
            alignItems: 'center',
            justifyContent: 'flex-start',
            height:messageBoxStyle.footHeight
        },
        touchableContainer: {
            borderBottomRightRadius: messageBoxStyle.messageBoxRadius,
            borderBottomLeftRadius: messageBoxStyle.messageBoxRadius,
            backgroundColor: Color.white,
            alignItems: 'center',
            justifyContent: 'center',
            height: messageBoxStyle.footHeight
        },
        touchableContainerNoRadius: {
            backgroundColor: Color.white,
            alignItems: 'center',
            justifyContent: 'center',
            height: messageBoxStyle.footHeight,
            borderBottomWidth: 1,
            borderColor: Color.border,
        },
        footerAndroid: {
            flexDirection: 'row',
            backgroundColor: Color.white,
            borderBottomRightRadius: messageBoxStyle.messageBoxRadius,
            borderBottomLeftRadius: messageBoxStyle.messageBoxRadius,
            alignItems: 'center',
            justifyContent: 'center',
            height: messageBoxStyle.footHeight,
            overflow: 'hidden'
        },
        footerVertical: {
            backgroundColor: Color.white,
            borderBottomRightRadius: messageBoxStyle.messageBoxRadius,
            borderBottomLeftRadius: messageBoxStyle.messageBoxRadius,
            height: messageBoxStyle.footHeight
        },
        footerType5: {
            flexDirection: 'row',
            backgroundColor: Color.white,
            height: messageBoxStyle.footHeight,
            borderBottomLeftRadius: messageBoxStyle.messageBoxRadius,
            borderBottomRightRadius: messageBoxStyle.messageBoxRadius,
            marginTop: Platform.OS == 'ios' ? -1 : 0,
            borderTopWidth: 1,
            borderColor: Color.border
        },
        footerLeft: {
            flex: 1,
            backgroundColor: Color.white,
            alignItems: 'center',
            justifyContent: 'center',
            borderBottomLeftRadius: messageBoxStyle.messageBoxRadius,
        },
        footerAndroidLeft: {
            flex: 1,
            padding: 10,
            alignItems: 'center',
            backgroundColor: Color.white,
            borderBottomLeftRadius: messageBoxStyle.messageBoxRadius,
        },
        footerLeftType5: {
            flex: 1,
            backgroundColor: Color.white,
            alignItems: 'center',
            justifyContent: 'center',
        },
        footerLeftText: {
            color: messageBoxStyle.footButtonTextColor,
            fontWeight: '400',
            fontSize: messageBoxStyle.footButtonFontSize,
        },
        footerLeftTextType5: {
            color: Color.messageBox.secondaryButton,
            fontWeight: '400',
            fontSize: messageBoxStyle.footButtonFontSize,
        },
        footerRight: {
            flex: 1,
            alignItems: 'center',
            backgroundColor: Color.white,
            borderBottomRightRadius: messageBoxStyle.messageBoxRadius,
            height: messageBoxStyle.footHeight,
            justifyContent: 'center',
         
        },
        footerAndroidRight: {
            flex: 1,
            padding: 10,
            alignItems: 'center',
            borderBottomRightRadius: messageBoxStyle.messageBoxRadius,
            backgroundColor: Color.white,
        },
        footerRightType5: {
            flex: 1,
            alignItems: 'center',
            backgroundColor: Color.white,
            justifyContent: 'center'
        },
        footerRightText: {
            color: messageBoxStyle.footRightButtonTextColor,
            fontWeight: '400',
            fontSize:  messageBoxStyle.footButtonFontSize
        },
        footerRightTextType5: {
            color: messageBoxStyle.footRightButtonTextColor,
            fontWeight: '400',
            fontSize: messageBoxStyle.footButtonFontSize,
        },          
        detailInput: {
            backgroundColor: Color.white,
            borderBottomWidth: 1,
            borderColor: Color.border,
            justifyContent: 'flex-start'
        },
        inputGroup: {
            marginTop: 9,
            marginBottom: 15,
            justifyContent: 'center',
            flexDirection: 'column',
        },
        inputWrapper1: {
            marginLeft: 20,
            marginRight: 20,
            borderWidth: 0.5,
            borderColor: Color.border,
        },
        inputWrapper2: {
            marginLeft: 20,
            marginRight: 20,
            borderWidth: 0.5,
            borderTopWidth: 0,
            borderColor: Color.border,
        },
        input: {
            height: 35,
            fontSize: messageBoxStyle.inputFontSize,
            paddingHorizontal: 5,
            paddingVertical: 5,
            color: messageBoxStyle.inputTextColor
        },
        closeContainer: {
            flexDirection: 'column',
            alignItems: 'center',
            justifyContent: 'flex-end',
            height: 65,
            backgroundColor: Color.transparent,
        },
        close: {
            alignItems: 'center',
            justifyContent: 'center',
            backgroundColor: Color.white,
            width: 45,
            height: 45,
            borderRadius: 45,
        },
        image: {
            width: 16,
            height: 16,
        },
        webViewStyle: {
            backgroundColor: Color.white
        },
    }
    return {
        messageBoxStyle,styles
    }
}

export { getMessageBoxStyle }